<template>
	<view class="scancode">
		<image src="../../static/codelogin.png" />
		<view class="webpage">网页登录确认</view>
		<view class="button-page">
			<button class="code-button" @click="scanCode" :disabled="disabled">登录</button>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		data () {
			return {
				code: '', // 扫码id
				disabled: false, /// 防止重复点击
			}
		},
		computed: {
			...mapState(['userInfo'])
		},
		onLoad(option) {
			console.log(option,this.userInfo)
			if(!option.code) {
				uni.showToast({
					title: '参数有误',
					icon: 'none'
				})
				uni.navigateBack({
					delta: 1
				})
				return
			}
			this.code = option.code
		},
		methods: {
			/**
			   * 时间： 2022/8/1，An
			   * 功能： 扫码登录
			   * 接口:  'api/auth/RQCodeLogin'，
			   * 参数： 'code'-->扫码id, 'userId'-->用户id
			*/
			scanCode() {
				this.disabled = true
				this.$http.get(`api/auth/RQCodeLogin?userId=${this.userInfo.userID}&code=${this.code}`).then((res) => {
					console.log(res,'+++++++++++++++++++++++')
					uni.showToast({
						title: '登录成功',
						icon: 'none',
						duration: 3000,
						success: function() {
							uni.navigateBack({
								delta: 1
							})
						}
					})
				}).catch(err => {
					console.log(err,'+++++++++++++++++++++++')
					this.disabled = false
					uni.showToast({
						title: '登录失败！',
						icon: 'none'
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.scancode {
		text-align: center;
		background-color: #fff;
		height: 100%;
		padding-bottom: 10%;
		.webpage {
			color: #ddd;
			margin: 20rpx 0;
			font-size: 26rpx;
		}
		.button-page {
			margin: 0 20rpx;
			.code-button {
				background-color: #b5021d;
				color: #fff;
				font-size: 36rpx;
				font-weight: bold;
				letter-spacing: 4rpx;
			}
		}
	}
</style>